<div class="layui-fluid nepadmin-pad0 nepadmin-mar0 list0 userlist" id="list" lay-title="学校档案管理">
	<div class="layui-fluid">
		<div class="layui-card">
			<div class="layui-tab layui-tab-brief">
				<ul class="layui-tab-title" v-cloak>
				  <li :class="{'layui-this':index==indexs}" v-for="(x,index) in tabn" @click="tab(x,index)">{{x.name}}</li>
				</ul>
				<div class="layui-tab-content" style="padding: 0;">
					<div class="layui-tab-item layui-show">
						<div class="layui-row">
							<div class="layui-col-md12">
								<div class="layui-card hxr-layui-card">
									<div class="layui-form hxradmin-card-header" v-if="indexs==0||(indexs==1&&tabn[indexs].type==1)">
										<div class="layui-form-item">
											<template v-if="indexs==0">
												<div class="layui-inline">
													<label class="layui-form-label">学校名称</label>
													<div class="layui-input-inline">
														<input type="text" name="user" autocomplete="off" class="layui-input">
													</div>
												</div>
											</template>
											<template v-if="indexs==1&&tabn[indexs].type==1">
												<div class="layui-inline">
													<label class="layui-form-label">院系名称</label>
													<div class="layui-input-inline">
														<input type="text" name="user" autocomplete="off" class="layui-input">
													</div>
												</div>
											</template>
											<!-- <div class="layui-inline">
												<label class="layui-form-label">角色</label>
												<div class="layui-input-inline">
													<div class="layui-unselect layui-form-select">
														<div class="layui-select-title"><input name="role" @click="roleF" readonly type="text" placeholder="请选择角色" class="layui-input layui-unselect"><i
															 class="layui-edge"></i></div>
														<dl class="layui-anim layui-anim-upbit">
															<dd class="layui-select-tips layui-this">请选择角色</dd>
															<dd :data='x.role_id' v-for="x in role" v-if="x.role_status==1">{{x.role_name}}</dd>
														</dl>
													</div>
												</div>
											</div> -->
											<!-- <div class="layui-inline">
												<label class="layui-form-label">状态</label>
												<div class="layui-input-inline">
													<div class="layui-unselect layui-form-select">
														<div class="layui-select-title"><input name="status" type="text" placeholder="请选择状态" value="" readonly class="layui-input layui-unselect"><i
															 class="layui-edge"></i></div>
														<dl class="layui-anim layui-anim-upbit" style="">
															<dd lay-value="" class="layui-select-tips layui-this">请选择状态</dd>
															<dd data='1'>启用</dd>
															<dd data='2'>停用</dd>
														</dl>
													</div>
												</div>
											</div> -->
											<div class="layui-inline">
												<button class="layui-btn" data-type="reload" id="search" @click="search">搜索</button>
											</div>
										</div>
									</div>
									<div class="layui-card-body">
										<div :class="{'type':indexs==1}">
											<button class="layui-btn layuiadmin-btn-list" data-type="batchdel">删除</button>
											<button class="layui-btn layuiadmin-btn-list" @click="add">添加</button>
											<div v-show="indexs==0" style="display: inline-block;">
												<a class="layui-btn layuiadmin-btn-list" download :href="url+'/upload/template/学校导入模板.xlsx'">导入模板下载</a>
												<button class="layui-btn layuiadmin-btn-list" id="daoru">学校excel表导入</button>
												<span style="color:#999;font-size: 12px;">(只能导入xls、xlsx文件，并文件内容第一行为标题)<span>
											</div>
											<div v-show="indexs==1&&tabn[indexs].type==1" style="display: inline-block;">
												<a class="layui-btn layuiadmin-btn-list"  :href="url+'/upload/template/院系导入模板.xlsx'">导入模板下载</a>
												<button class="layui-btn layuiadmin-btn-list" id="daoruy">院系excel表导入</button>
												<span style="color:#999;font-size: 12px;">(只能导入xls、xlsx文件，并文件内容第一行为标题)<span>
											</div>
											<div v-show="indexs==1&&tabn[indexs].type==2" style="display: inline-block;">
												<a class="layui-btn layuiadmin-btn-list"  :href="url+'/upload/template/宿舍导入模板.xlsx'">导入模板下载</a>
											<button class="layui-btn layuiadmin-btn-list" id="daoruys">楼栋excel表导入</button>
												<span style="color:#999;font-size: 12px;">(只能导入xls、xlsx文件，并文件内容第一行为标题)<span>
											</div>
										</div>
										<table class="layui-hide" id="list-table" lay-filter="list-table"></table>
										<div id="list-toolbar" style="display: none;">
											<template v-if="indexs==0">
												<button class="layui-btn layui-btn-normal layui-btn-xs" type="button" lay-event="lookYuan">查看院系</button>
												<button class="layui-btn layui-btn-normal layui-btn-xs" type="button" lay-event="lookShu">查看宿舍</button>
											</template>
											<template v-else-if="indexs==1&&tabn[indexs].type==1">
												<button class="layui-btn layui-btn-normal layui-btn-xs" type="button" lay-event="lookZhuan">查看专业</button>
											</template>
											<template v-else-if="indexs==1&&tabn[indexs].type==2">
												<button class="layui-btn layui-btn-normal layui-btn-xs" type="button" lay-event="lookLou">查看楼栋</button>
											</template>
											<template v-else-if="indexs==2&&tabn[indexs].type==1">
												<button class="layui-btn layui-btn-normal layui-btn-xs" type="button" lay-event="lookNian">查看年级</button>
											</template>
											<template v-else-if="indexs==2&&tabn[indexs].type==2">
												<button class="layui-btn layui-btn-normal layui-btn-xs" type="button" lay-event="lookRoom">查看房间</button>
											</template>
											<template v-else-if="indexs==3&&tabn[indexs].type==1">
												<button class="layui-btn layui-btn-normal layui-btn-xs" type="button" lay-event="lookClass">查看班级</button>
											</template>
											<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
											<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
<style type="text/css">
	[v-cloak] {
	  display: none;
	}
	.type #daoru,#daoruy,#daoruys{
		display: none !important;
	}
	.type #daoruy{
		display: inline-block !important;
	}
	.type #daoruys{
		display: inline-block !important;
	}
</style>
<script>
	var formurl='record/schoolform',formarea=['500px', '200px'];
	//表格数据渲染
	layui.use(['table', 'form','upload'], function() {
		var table = layui.table,
			form = layui.form,
			$ = layui.$,upload=layui.upload;
			var list=new Vue({
				el:'#list',
				data:{
					tabn:[{name:'学校'}],
					indexs:0,
					url:layui.conf.url,
					tabc:[
						[
							[{
										type:'checkbox'
									}, {
								field: 'schools_id',
								title: 'ID',
								width: 60
							}, {
								field: 'school_name',
								title: '学校名称',
								minWidth: 100
							}, {
								field: 'institutes_lower_total',
								title: '院系数量',
								width: 100
							}, {
								field: 'school_lower_total',
								title: '宿舍量',
								width: 100
							},{
								field: 'create_time',
								title: '创建时间',
								width: 200,
								sort: true
							}, {
								title: '操作',
								toolbar: '#list-toolbar',
								width: 300,
								fixed:'right'
							}]
						],[
							[{
										type:'checkbox'
									}, {
										field: 'institute_id',
										title: 'ID',
										width: 60
									}, {
										field: 'institute_name',
										title: '院系名称',
										minWidth: 100
									},{
										field: 'create_time',
										title: '创建时间',
										width: 200,
										sort: true
									}, {
										title: '操作',
										toolbar: '#list-toolbar',
										width: 220,
										fixed:'right'
									}]
						],
						[
							[{
										type:'checkbox'
									}, {
										field: 'dormitory_id',
										title: 'ID',
										width: 60
									}, {
										field: 'dormitory_name',
										title: '宿舍名称',
										minWidth: 100
									},{
										field: 'create_time',
										title: '创建时间',
										width: 200,
										sort: true
									}, {
										title: '操作',
										toolbar: '#list-toolbar',
										width: 220,
										fixed:'right'
									}]
						],
						[
							[{
										type:'checkbox'
									}, {
										field: 'majors_id',
										title: 'ID',
										width: 60
									}, {
										field: 'majors_name',
										title: '专业名称',
										minWidth: 100
									},{
										field: 'create_time',
										title: '创建时间',
										width: 200,
										sort: true
									}, {
										title: '操作',
										toolbar: '#list-toolbar',
										width: 220,
										fixed:'right'
									}]
						],
						[
							[{
										type:'checkbox'
									}, {
										field: 'tung_id',
										title: 'ID',
										width: 60
									}, {
										field: 'tung_name',
										title: '	楼栋名称',
										minWidth: 100
									},{
										field: 'create_time',
										title: '创建时间',
										width: 200,
										sort: true
									}, {
										title: '操作',
										toolbar: '#list-toolbar',
										width: 220,
										fixed:'right'
									}]
						],
						[
							[{
										type:'checkbox'
									}, {
										field: 'room_id',
										title: 'ID',
										width: 60
									}, {
										field: 'room_name',
										title: '房间号',
										minWidth: 100
									},{
										field: 'create_time',
										title: '创建时间',
										width: 200,
										sort: true
									}, {
										title: '操作',
										toolbar: '#list-toolbar',
										width: 150,
										fixed:'right'
									}]
						],
						[
							[{
										type:'checkbox'
									}, {
										field: 'grade_id',
										title: 'ID',
										width: 60
									}, {
										field: 'grade_name',
										title: '年级名称',
										minWidth: 100
									},{
										field: 'create_time',
										title: '创建时间',
										width: 200,
										sort: true
									}, {
										title: '操作',
										toolbar: '#list-toolbar',
										width: 220,
										fixed:'right'
									}]
						],
						[
							[{
										type:'checkbox'
									}, {
										field: 'class_id',
										title: 'ID',
										width: 100
									}, {
										field: 'class_name',
										title: '班级名字',
										minWidth: 100
									},{
										field: 'create_time',
										title: '创建时间',
										width: 200,
										sort: true
									}, {
										title: '操作',
										toolbar: '#list-toolbar',
										width: 200,
										fixed:'right'
									}]
						],
					]
				},
				mounted:function(){
					this.initList('schools/list',this.tabc[0],'',320);
					//监听表格操作事件
					var _this=this,upload1,upload2;
					table.on('tool(list-table)', function(obj) {
						var data = obj.data;
						//删除
						if (obj.event === 'del') {
							var name=data.school_name,id={schools_id:data.schools_id},url='schools/delete';
							if(_this.indexs==1&&_this.tabn[_this.indexs].type==1){
								name=data.institute_name,id={institute_id:data.institute_id},url='schools/institute_delete';
							}else if(_this.indexs==1&&_this.tabn[_this.indexs].type==2){
								name=data.dormitory_name,id={dormitory_id:data.dormitory_id},url='schools/dormitory_delete';
							}else if(_this.indexs==2&&_this.tabn[_this.indexs].type==1){
								name=data.majors_name,id={majors_id:data.majors_id},url='schools/majors_delete';
							}else if(_this.indexs==2&&_this.tabn[_this.indexs].type==2){
								name=data.tung_name,id={tung_id:data.tung_id},url='schools/tung_delete';
							}else if(_this.indexs==3&&_this.tabn[_this.indexs].type==2){
								name=data.room_name,id={room_id:data.room_id},url='schools/room_delete';
							}else if(_this.indexs==3&&_this.tabn[_this.indexs].type==1){
								name=data.grade_name,id={grade_id:data.grade_id},url='schools/grade_delete';
							}else if(_this.indexs==4){
								name=data.class_name,id={class_id:data.class_id},url='schools/class_delete';
							}
							layer.confirm('确定删除' + name + '?', function(index) {
								layui.admin.delF(table,url,id);
							});
						} else if (obj.event === 'edit') { //编辑
							var title='编辑学校';
							if(_this.indexs==1){
								if(_this.tabn[1].type==1){
									title='编辑院系';
								}else{
									title='编辑宿舍';
								}
							}else if(_this.indexs==2&&_this.tabn[_this.indexs].type==1){
								title='编辑专业';
								formarea[1]='270px';
							}else if(_this.indexs==2&&_this.tabn[_this.indexs].type==2){
								title='编辑楼栋';
								formarea[1]='270px';
							}else if(_this.indexs==3&&_this.tabn[_this.indexs].type==2){
								title='编辑房间';
								formarea[1]='270px';
							}else if(_this.indexs==3&&_this.tabn[_this.indexs].type==1){
								title='编辑年级';
								formarea[1]='270px';
							}else if(_this.indexs==4){
								title='编辑班级';
								formarea[1]='270px';
							}
							data.types=_this.tabn[_this.indexs].type==2?_this.indexs+'1':_this.indexs;
							layui.admin.pupF(title,formarea,formurl, 2, data)
						} else if (obj.event === 'lookYuan') {
							_this.tabn[1]={name:'院系('+data.school_name+')',type:1,cha:{school_id:data.schools_id}};
							_this.indexs=1,_this.tabn.length=2;
							_this.initList('schools/institutes_list',_this.tabc[1],{school_id:data.schools_id},320);
							if(!upload1){
								upload1=upload.render({
								  elem: '#daoruy'
								  ,url: layui.conf.ajaxUrl+'schools/import_file_class'
								  ,field:'excel_file'
								  ,data:{school_id:data.schools_id}
								  ,accept:'file'
								  ,exts:'xls|xlsx'
								  ,before: function(obj){
								    layer.load(1);
								  }
								  ,done: function(res, index, upload){
								    layer.closeAll('loading');
									table.reload('list-table');
								  }
								  ,error: function(index, upload){
								    layer.closeAll('loading');
								  }
								});
							}else{
								upload1.config.data.school_id=data.schools_id;
							}
						} else if (obj.event === 'lookShu') {
							_this.tabn[1]={name:'宿舍('+data.school_name+')',type:2,cha:{school_id:data.schools_id}};
							_this.indexs=1,_this.tabn.length=2;
							_this.initList('schools/dormitory_list',_this.tabc[2],{school_id:data.schools_id});
							if(!upload2){
								upload2=upload.render({
									elem: '#daoruys'
									,url: layui.conf.ajaxUrl+'schools/import_file_room'
									,field:'excel_file'
									,data:{school_id:data.schools_id}
									,accept:'file'
									,exts:'xls|xlsx'
									,before: function(obj){
										layer.load(1);
									}
									,done: function(res, index, upload){
										layer.closeAll('loading');
										table.reload('list-table');
									}
									,error: function(index, upload){
										layer.closeAll('loading');
									}
								});
							}else{
								upload2.config.data.school_id=data.schools_id;
							}
						}else if (obj.event === 'lookZhuan') {
							_this.tabn[2]={name:'专业('+data.institute_name+')',type:1,cha:{school_id:data.schools_id,institute_id:data.institute_id}};
							_this.indexs=2,_this.tabn.length=3;
							_this.initList('schools/majors_list',_this.tabc[3],{schools_id:data.school_id,institute_id:data.institute_id});
						}else if (obj.event === 'lookLou') {
							_this.tabn[2]={name:'楼栋('+data.dormitory_name+')',type:2,cha:{schools_id:data.schools_id,dormitory_id:data.dormitory_id}};
							_this.indexs=2,_this.tabn.length=3;
							_this.initList('schools/tung_list',_this.tabc[4],{schools_id:data.schools_id,dormitory_id:data.dormitory_id});
						}else if (obj.event === 'lookRoom') {
							_this.tabn[3]={name:'房间('+data.tung_name+')',type:2,cha:{tung_id:data.tung_id}};
							_this.indexs=3,_this.tabn.length=4;
							_this.initList('schools/room_list',_this.tabc[5],{tung_id:data.tung_id});
						}else if (obj.event === 'lookNian') {
							_this.tabn[3]={name:'年级('+data.majors_name+')',type:1,cha:{majors_id:data.majors_id}};
							_this.indexs=3,_this.tabn.length=4;
							_this.initList('schools/grade_list',_this.tabc[6],{majors_id:data.majors_id});
						}else if (obj.event === 'lookClass') {
							_this.tabn[4]={name:'班级('+data.grade_name+')',cha:{grade_id:data.grade_id}};
							_this.indexs=4,_this.tabn.length=5;
							_this.initList('schools/class_list',_this.tabc[7],{grade_id:data.grade_id});
						}
					});
					var active = {
						//多行删除
						batchdel: function() {
							var id='schools_id',url='schools/delete';
							if(_this.indexs==1&&_this.tabn[_this.indexs].type==1){
								id='institute_id',url='schools/institute_delete';
							}else if(_this.indexs==1&&_this.tabn[_this.indexs].type==2){
								id='dormitory_id',url='schools/dormitory_delete';
							}else if(_this.indexs==2&&_this.tabn[_this.indexs].type==1){
								id='majors_id',url='schools/majors_delete';
							}else if(_this.indexs==2&&_this.tabn[_this.indexs].type==2){
								id='tung_id',url='schools/tung_delete';
							}else if(_this.indexs==3&&_this.tabn[_this.indexs].type==2){
								id='room_id',url='schools/room_delete';
							}else if(_this.indexs==3&&_this.tabn[_this.indexs].type==1){
								id='grade_id',url='schools/grade_delete';
							}else if(_this.indexs==4){
								id='class_id',url='schools/class_delete';
							}
								layui.admin.delsF(table,url,id);
						}
					};
					//操作dom
					$('.layui-btn.layuiadmin-btn-list').on('click', function() {
						var type = $(this).data('type');
						active[type] ? active[type].call(this) : '';
					});
				},
				methods:{
					roleF:function(){
						var _this=this;
						if(!this.role){
							layui.admin.ajax('role/list',{},1).then(function(res){
								_this.role=res.data.list;
							}).catch(function(res){});
						}
					},
					initList:function(url,data,datas,height){
						layui.admin.initlist(table,url,(height?height:235),data,'','','',datas)
					},
					tab:function(x,index){
						this.indexs=index;
						if(index==1){
							if(this.tabn[index].type==1){
								this.initList('schools/institutes_list',this.tabc[1],this.tabn[index].cha,320);
							}else{
								this.initList('schools/dormitory_list',this.tabc[2],this.tabn[index].cha);
							}
						}else if(index==2){
							if(this.tabn[index].type==1){
								this.initList('schools/majors_list',this.tabc[3],this.tabn[index].cha);
							}else{
								this.initList('schools/tung_list',this.tabc[4],this.tabn[index].cha);
							}
						}else if(index==3){
							if(this.tabn[index].type==1){
								this.initList('schools/grade_list',this.tabc[6],this.tabn[index].cha);
							}else{
								this.initList('schools/room_list',this.tabc[5],this.tabn[index].cha);
							}
						}else if(index==4){
							this.initList('schools/class_list',this.tabc[7],this.tabn[index].cha);
						}else if(!index){
							this.initList('schools/list',this.tabc[0],'',320);
						}
					},
					add:function(){
						var title='添加学校',id='',school_id='';
						if(this.indexs==1){
							if(this.tabn[1].type==1){
								title='添加院系';
							}else{
								title='添加宿舍';
							}
							id=this.tabn[1].cha.school_id;
							school_id='';
						}else if(this.indexs==2){
							if(this.tabn[2].type==1){
								title='添加专业';
								id=this.tabn[2].cha;
							}else{
								title='添加楼栋';
								id=this.tabn[2].cha.dormitory_id;
							}
							school_id=this.tabn[1].cha.school_id;
							formarea[1]='270px';
						}else if(this.indexs==3){
							if(this.tabn[3].type==1){
								title='添加年级';
								id=this.tabn[3].cha.majors_id;
							}else{
								title='添加房间';
								id=this.tabn[3].cha.tung_id;
							}
							school_id=this.tabn[1].cha.school_id;
							formarea[1]='270px';
						}else if(this.indexs==4){
							title='添加班级';
							id=this.tabn[4].cha.grade_id;
							formarea[1]='270px';
							school_id=this.tabn[1].cha.school_id;
						}
						layui.admin.pupF(title, formarea, formurl, 1, {types:(this.tabn[this.indexs].type==2?this.indexs+'1':this.indexs),id:id,school_id:school_id})
					},
					search:function(){
						var val1 = $('input[name="user"]').val()
						//执行重载
						layui.admin.reloads({
							search_text: val1
						});
					}
				}
			});
		upload.render({
		  elem: '#daoru'
		  ,url: layui.conf.ajaxUrl+'schools/import_file'
		  ,field:'excel_file'
		  ,accept:'file'
		  ,exts:'xls|xlsx'
		  ,before: function(obj){
		    layer.load(1);
		  }
		  ,done: function(res, index, upload){
		    layer.closeAll('loading');
			table.reload('list-table');
		  }
		  ,error: function(index, upload){
		    layer.closeAll('loading');
		  }
		});	
		
		//监听表格表单操作
		form.on('switch(list-tableF)', function(obj) {
			var json = JSON.parse(decodeURIComponent($(this).data('json')));
			json = table.clearCacheKey(json);
			layui.admin.ajax('admins/update', {
				status:json.status == 1?2:1,
				admin_id:json.admin_id
			}).then(function(res){
				layui.table.reload('list-table');
			}).catch(function(res){});
		});
		
	});
</script>
